<!DOCTYPE html>
<html lang="en">
<head>
	<title>react-geo</title>
	<meta charset="utf-8">
	<meta content="width=device-width, initial-scale=1" name="viewport">
	<link href="assets/landing_page.css" rel="stylesheet" type="text/css">
	<link rel="shortcut icon" type="image/x-icon" href="./assets/favicon.ico">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
</head>
<body>
	<script>
	             $(document).ready(function() {
	                 function checkWidth() {
	                     var windowWidth = $(window).width();
	                     if (windowWidth <= 767) {
	                         $("#gh-link").show();
	                     } else {
	                         $("#gh-link").hide();
	                     }
	                 }
	                 checkWidth();
	                 $(window).resize(checkWidth);
	             });
	</script>
	<div class="collapse navbar-collapse">
		<a href="https://github.com/terrestris/react-geo"><img alt="Fork me on GitHub" src="https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png" style="position: absolute; top: 0; right: 0; border: 0; z-index:1000"></a>
	</div><!-- Navbar -->
	<nav class="navbar navbar-default">
		<div class="container">
			<div class="navbar-header">
				<button class="navbar-toggle" data-target="#myNavbar" data-toggle="collapse" type="button"><span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span></button> <img src="assets/logo.svg" style="width: 70px;"> <a class="navbar-brand" href="">react-geo</a>
			</div>
			<div class="collapse navbar-collapse" id="myNavbar">
				<ul class="nav navbar-nav navbar-center">
					<li>
						<a href="./docs/latest/index.html">Components</a>
					</li>
					<li id="gh-link">
						<a href="https://github.com/terrestris/react-geo">Github</a>
					</li>
				</ul>
			</div>
		</div>
	</nav><!-- First Container -->
	<div class="container-fluid text-center">
		<div class="carousel slide" id="myCarousel">
			<!-- Wrapper for slides -->
			<div class="carousel-inner" role="listbox">
				<div class="text-center item active">
					<img src="assets/logo.svg" style="display:inline" width="200">
					<h3>A set of geo related modules<br>
					to use in combination with with <a href="https://reactjs.org/">react</a>, <a href="https://ant.design/">antd</a> and <a href="https://openlayers.org">ol</a>.</h3>
					<div class="carousel-caption"></div>
				</div>
				<div class="item">
					<div class="item2">
						<h3>Create your own WebGIS easily with the power of React, antd and OpenLayers</h3>
					</div>
					<div class="carousel-caption"></div>
				</div>
				<div class="item">
					<h3>Check out <a href="docs/latest/index.html">examples</a> and <a href="./wiki/Feature-List">feature list</a> for full functionality of react-geo.</h3><br>
					<img class="rounded img-exp" src="assets/geoutil.png" style="vertical-align:middle" width="286px"> <span style="font-size: 22px;">GeometryUtil features<br>
					<span style="font-size: 22px;">Map components</span><img class="rounded img-exp" src="assets/distance.png"></span>
					<div class="carousel-caption"></div>
				</div><!-- Left and right controls -->
				<a class="left carousel-control" data-slide="prev" href="#myCarousel" role="button"><span aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span> <span class="sr-only">Previous</span></a> <a class="right carousel-control" data-slide="next" href="#myCarousel" role="button"><span aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span> <span class="sr-only">Next</span></a>
			</div>
		</div>
	</div><!-- Footer -->
	<footer class="container-fluid-footer bg-4 text-center"></footer>
</body>
</html>
